/* banner */
.banner{
    width: 100%;
    height: 126px;
    position: relative;
    margin-bottom: 1.5em;

    .back{
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
        opacity: 0;
        animation: pic 12s linear infinite;

        img{
            width: 100%;
            height: 100%;
        }

        &:nth-child(1){
            animation-delay: 0s;
        }

        &:nth-child(2){
            animation-delay: 6s;
        }
    }

    @keyframes pic{
        0%{ opacity: 0; }
        50%{ opacity: 1; }
        100%{ opacity: 0; }
    }
}

/* 风险评估 */
.function{
    position: relative;
    border-top: 1px solid #bdbdbd;
    margin-bottom: 1.5em;

    .title{
        text-align: center;
        color: #1c91dd;
        font-size: 1.3em;
        position: relative;
        top: -.7em;
        background: white;
        width: 26%;
        margin: 0 auto;
    }

    .list{
        display: flex;
        justify-content: space-around;
        margin-bottom: 1.2em;

        .item{
            width: 23%;
            text-align: center;

            .thumb{
                width: 80%;
                margin: 0 auto;
                margin-bottom: .5em;
            }

            .desc{
                color: #000;
                font-size: 1.1em;
            }
        }
    }

    .box{
        display: flex;
        flex-wrap: wrap;

        .back,.content{
            width: 33.3%;
        }

        .content{
            background: #f5f5f5;
            padding: .5em .8em;

            .subject{
                color: #000;
                font-size: 1.2em;
                margin-bottom: .3em;
            }

            .info{
                a{
                    display: block;
                    color: #666;
                    margin: .2em auto;
                }
            }
        }
    }
}

/* 应用 */
.app{
    position: relative;
    border-top: 1px solid #bdbdbd;
    margin-bottom: 1.5em;

    .title{
        text-align: center;
        color: #1c91dd;
        font-size: 1.3em;
        position: relative;
        top: -.7em;
        background: white;
        width: 50%;
        margin: 0 auto;
    }

    .app_banner{
        position: relative;
        margin-top: -.4em;

        .app_banner_img:hover + .app_back{
            left: 0;
        }

        .app_back{
            transition: all linear .3s;
            position: absolute;
            left: -36%;
            top: 0;
            width: 36%;
            height: 100%;
            background: rgba(0, 0, 0, 0.8);
            padding: 1.2em 0.8em;
            color: #fff;

            .short{
                font-weight: bold;
                margin-bottom: .8em;
            }

            .taglist{
                .tag{
                    display: inline-block;
                    border: 1px solid #fff;
                    padding: .1em .8em;
                    margin-bottom: .5em;
                }
            }
        }
    }

    .app_btnlist{
        display: inline-flex;
        justify-content: space-between;
        margin: 1em auto;
        width: 100%;

        .item{
            background: #55acee;
            display: inline-flex;
            justify-content: center;
            align-items: center;
            width: 50%;
            height: 3.2em;
            font-size: 1.3em;
            color: #fff;
            font-weight: bold;

            .item_img{
                width: 1.5em;
                margin-right: .5em;
            }

            &:first-child{
                margin-right: .1em;
            }

            &:last-child{
                margin-left: .1em;
                background: #3b5998;
            }

            span{
                font-size: .8em;
            }
        }
    }

    .app_btnlist2{
        background: #363a42;
        display: inline-flex;
        justify-content: center;
        align-items: center;
        width: 100%;
        height: 3.2em;
        font-size: 1.3em;
        font-weight: bold;
        color: #fff;
        
        .item_img{
            width: 2em;
            margin-right: 0.5em;
        }

        span{
            font-size: .8em;
        }
    }
}

/* 联系我们 */
.contact{
    position: relative;
    border-top: 1px solid #bdbdbd;
    margin-bottom: 1em;

    .title{
        text-align: center;
        color: #1c91dd;
        font-size: 1.3em;
        position: relative;
        top: -.7em;
        background: white;
        width: 26%;
        margin: 0 auto;
    }

    .content{
        margin: 0em 1em;
        margin-bottom: 1em;

        .line{
            margin-bottom: .5em;

            img{
                width: 1.8em;
            }

            span{
                display: inline-block;
                font-size: .8em;
                margin-left: .3em;
            }
        }

        .line:nth-child(2){
            margin-bottom: .5em;
            display: inline-flex;
            justify-content: space-between;
            align-items: center;

            .item{
                img{
                    width: 1.8em;
                }

                span{
                    display: inline-block;
                    font-size: .8em;
                    margin-left: .3em;
                }

                &:last-child{
                    margin-left: 1.5em;
                }
            }
        }
    }

    .map{
        width: 100%;
        height: 15em;
        overflow: hidden;
    }
}